<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="zh-CN">

<head>
    <link rel="shortcut icon" href="https://www.itsource.cn/img/logo_small.jpg">
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

    <title>源码云课堂 - 购我所爱 I LOVE BUY</title>

    <meta http-equiv="X-UA-Compatible" content="IE=edge,Chrome=1">
    <!-- 网站头像 -->
    <link type="text/css" rel="stylesheet" href="css/iconfont.css">
    <link type="text/css" rel="stylesheet" href="css/common.css">
    <!--整站改色 _start-->
    <link type="text/css" rel="stylesheet" href="css/color-style.css">
    <!--整站改色 _end-->
    <link rel="stylesheet" href="css/layer.css" id="layuicss-skinlayercss">
    <script type="text/javascript" src="js/jquery.js"></script>
    <script type="text/javascript" src="js/jquery.cookie.js"></script>
    <script type="text/javascript" src="js/layer.js"></script>
    <script type="text/javascript" src="js/jquery.method.js"></script>
    <script type="text/javascript" src="js/jquery.modal.js"></script>


    <!-- 图片缓载js -->
    <script type="text/javascript" src="js/jquery.lazyload.js"></script>
    <script src="./dist/hls.js"></script>
    <!--导入vue和axios-->
    <script type="text/javascript" src="js/plugins/vue/dist/vue.js"></script>
    <script type="text/javascript" src="js/plugins/axios/dist/axios.js"></script>
    <script type="text/javascript" src="js/axios.common.js"></script>
    <link rel="stylesheet" href="js/jqueryAlert/alert.css">
    <script src="js/jqueryAlert/alert.js"></script>

    <script type="text/javascript">
        $(document).ready(function () {
            // 搜索框提示显示
            $('.SZY-SEARCH-BOX .SZY-SEARCH-BOX-KEYWORD').focus(function () {
                $(".SZY-SEARCH-BOX .SZY-SEARCH-BOX-HELPER").show();
            });
            // 搜索框提示隐藏
            $(".SZY-SEARCH-BOX-HELPER .close").on('click', function () {
                $(".SZY-SEARCH-BOX .SZY-SEARCH-BOX-HELPER").hide();
            });
            // 清除记录
            $(".SZY-SEARCH-BOX-HELPER .clear").click(function () {
                var url = '/search/clear-record.html';
                $.post(url, {}, function (result) {
                    if (result.code == 0) {
                        $(".history-results .active").empty();
                    } else {
                    }
                }, 'json');
            });

            $(".SZY-SEARCH-BOX-TOP .SZY-SEARCH-BOX-SUBMIT-TOP").click(function () {
                if ($(".search-li-top.curr").attr('num') == 0) {
                    var keyword_obj = $(this).parents(".SZY-SEARCH-BOX-TOP").find(".SZY-SEARCH-BOX-KEYWORD");

                    var keywords = $(keyword_obj).val();
                    if ($.trim(keywords).length == 0 || $.trim(keywords) == "请输入关键词") {
                        keywords = $(keyword_obj).data("searchwords");
                    }
                    $(keyword_obj).val(keywords);
                }
                $(this).parents(".SZY-SEARCH-BOX-TOP").find(".SZY-SEARCH-BOX-FORM").submit();
            });

            $(".SZY-SEARCH-BOX .SZY-SEARCH-BOX-SUBMIT").click(function () {
                if ($(".search-li.curr").attr('num') == 0) {
                    var keyword_obj = $(this).parents(".SZY-SEARCH-BOX").find(".SZY-SEARCH-BOX-KEYWORD");

                    var keywords = $(keyword_obj).val();
                    if ($.trim(keywords).length == 0 || $.trim(keywords) == "请输入关键词") {
                        keywords = $(keyword_obj).data("searchwords");
                    }
                    $(keyword_obj).val(keywords);
                }
                $(this).parents(".SZY-SEARCH-BOX").find(".SZY-SEARCH-BOX-FORM").submit();
            });
        });

        function search_box_remove(key) {
            var url = '/search/delete-record.html';
            $.post(url, {
                data: key
            }, function (result) {
                if (result.code == 0) {
                    $("#" + key).css("display", "none");
                } else {

                }
            }, 'json');
        }

        $(document).on("click", function (e) {
            var target = $(e.target);
            if (target.closest(".SZY-SEARCH-BOX").length == 0) {
                $('.SZY-SEARCH-BOX-HELPER').hide();
            }
        });
    </script>

    <!-- 开始：主要区域内容 -->
    <!-- css -->
    <link type="text/css" rel="stylesheet" href="css/goods.css">
    <!-- 地区选择器 -->
    <script type="text/javascript" src="js/jquery.region.js"></script>
    <script type="text/javascript" src="js/jquery.widget.js"></script>
    <script type="text/javascript" src="js/jquery.history.js"></script>

</head>

<body class="pace-done">
<div id="myBody">

        <!-- 站点选择 -->
        <div class="header-top">
        <div class="header-box">

            <!-- 站点 -->
            <!--站点 start-->
            <div class="SZY-SUBSITE">

            </div>
            <!--站点 end-->
            <font id="login-info" class="login-info SZY-USER-NOT-LOGIN">
                <a class="login color" href="http://user.ymcc.com:6003/login.html" target="_top">请登录</a>
                <a class="register" href="http://user.ymcc.com:6003/register.html" target="_top">免费注册</a>
            </font>
            <font class="login-info SZY-USER-ALREADY-LOGIN" style="display: none;">
                <em>
                    <a href="user.html" target="_blank" class="color SZY-USER-NAME"></a>
                    <!--欢迎您回来!-->
                </em>
                <a href="site/logout" data-method="post">退出</a>
            </font>

            <ul>
                <li>
                    <a class="menu-hd home" href="http://course.ymcc.com:6002/index.html" target="_top">
                        <i></i> 源码云课堂首页
                    </a>
                </li>
                <li class="menu-item">
                    <div class="menu">
                        <a class="menu-hd myinfo" href="http://user.ymcc.com:6003/user.home.html" target="_blank">
                            <i></i> 会员中心
                            <b></b>
                        </a>
                    </div>
                </li>
                <li class="menu-item cartbox">
                    <div class="menu">
                        <a class="menu-hd cart" href="cart.html" target="_top">
                            <i></i> 购物车
                            <span class="SZY-CART-COUNT">0</span>
                            <b></b>
                        </a>
                        <div id="menu-4" class="menu-bd cart-box-main">
                            <span class="menu-bd-mask"></span>
                            <div class="dropdown-layer">
                                <div class="spacer"></div>
                                <div class="dropdown-layer-con cartbox-goods-list">

                                    <!-- 正在加载 -->
                                    <div class="cart-type">
                                        <i class="cart-type-icon"></i>
                                    </div>

                                </div>
                            </div>
                        </div>
                    </div>
                </li>

                <li class="menu-item">
                    <div class="menu">
                        <a class="menu-hd we-chat" href="" target="_top">
                            <i></i> 关注源码云课堂
                            <b></b>
                        </a>
                        <div id="menu-5" class="menu-bd we-chat-qrcode">
                            <span class="menu-bd-mask"></span>
                            <a target="_top">
                                <img src="img/test/mall_wx_qrcode_0.jpg" alt="官方微信">
                            </a>
                            <p class="font-14">关注官方微信</p>
                        </div>
                    </div>
                </li>

                <li class="menu-item">
                    <div class="menu">
                        <a href="" class="menu-hd site-nav" target="_blank">
                            更多支持
                            <b></b>
                        </a>
                        <div id="menu-7" class="menu-bd site-nav-main">
                            <span class="menu-bd-mask"></span>
                            <div class="menu-bd-panel">
                                <div class="site-nav-con">

                                    <a href="article/info?id=38" target="_blank" title="新手上路">新手上路</a>

                                    <a href="article/info?id=38" target="_blank" title="支付方式">支付方式</a>

                                    <a href="article/list/3.html" target="_blank" title="配送服务">配送服务</a>

                                    <a href="article/list/4.html" target="_blank" title="售后服务">售后服务</a>

                                    <a href="article/info?id=38" target="_blank" title="商家合作">商家合作</a>

                                    <a href="list.html?cat_id=17" target="_blank" title="店铺街">店铺街</a>

                                </div>
                            </div>
                        </div>
                    </div>
                </li>

            </ul>
        </div>
    </div>

        <div class="header">
            <div class="w1210">
                <div class="logo-info">
                    <a href="/" class="logo">
                        <img src="img/test/mall_logo_0.png">
                    </a>

                    <!-- logo右侧小广告 _start -->
                    <a href="#" class="logo-right">
                        <img src="img/test/mall_logo_right_ad_image_0.png">
                    </a>
                    <!-- logo右侧小广告 _end -->

                </div>
                <div class="search SZY-SEARCH-BOX">
                    <form class="search-form SZY-SEARCH-BOX-FORM" method="get" action="search.html">
                        <div class="search-info">
                            <div class="search-type-box">
                                <ul class="search-type">
                                    <li class="search-li curr" num="0">课程</li>
                                    <li class="search-li" num="1">店铺</li>
                                </ul>
                                <i></i>
                            </div>
                            <div class="search-box">
                                <div class="search-box-con">
                                    <input type="text" class="keyword search-box-input SZY-SEARCH-BOX-KEYWORD"
                                           name="keyword" tabindex="9" autocomplete="off" data-searchwords="特价课程"
                                           placeholder="搜索特价课程" value="">
                                </div>
                            </div>
                            <input type="hidden" id="searchtype" name="type" value="0" class="searchtype">
                            <button id="btn_search_box_submit"
                                    class="button bg-color btn_search_box_submit SZY-SEARCH-BOX-SUBMIT"></button>
                        </div>
                        <!---热门搜索热搜词显示--->

                        <div class="search-results hide SZY-SEARCH-BOX-HELPER">
                            <ul class="history-results">
                                <li class="title">
                                    <span>最近搜索</span>
                                    <a href="javascript:void(0);" class="clear-history clear">
                                        <i></i> 清空
                                    </a>
                                </li>
                                <!---->
                            </ul>
                            <ul class="rec-results">
                                <li class="title">
                                    <span>正在热搜中</span>
                                    <i class="close"></i>
                                </li>

                                <li>
                                    <a target="_blank" href="#">Java</a>
                                </li>

                                <li>
                                    <a target="_blank" href="#">SpringCloud</a>
                                </li>

                                <li>
                                    <a target="_blank" href="#">Mybatis高级</a>
                                </li>

                                <li>
                                    <a target="_blank" href="#">Redis源码</a>
                                </li>

                                <li>
                                    <a target="_blank" href="#">Jedis</a>
                                </li>

                            </ul>
                        </div>
                    </form>
                    <ul class="hot-query">
                        <!-- 默认搜索词 -->

                        <li class="first">
                            <a href="#">JAVA</a>
                        </li>

                        <li>
                            <a href="#">SpringCloud</a>
                        </li>

                        <li>
                            <a href="#">大数据</a>
                        </li>

                        <li>
                            <a href="#">微服务</a>
                        </li>

                        <li>
                            <a href="#">Redis</a>
                        </li>

                        <li>
                            <a href="#">ElasticSearch</a>
                        </li>

                        <li>
                            <a href="#">k8s</a>
                        </li>

                    </ul>
                </div>

                <!-- 搜索框右侧小广告 _start -->

                <div class="header-right">
                    <a href="#" title="">
                        <img src="img/test/mall_search_right_ad_image_0.png">
                    </a>
                </div>

                <!-- 搜索框右侧小广告 _end -->

            </div>
        </div>

        <!-- 站点导航 -->
        <!-- 判断url链接 -->
        <div class="category-box category-box-border">
            <div class="w1210">
                <div class="home-category fl">
                    <a href="#" class="menu-event" title="查看全部课程分类">
                        <i></i> 全部课程分类
                    </a>
                    <div class="expand-menu category-layer">
                        <span class="category-layer-bg bg-color"></span>
                    </div>
                </div>

                <div class="all-category fl" id="nav">
                    <ul>

                        <li class="fl">
                            <a class="nav current" href="/" target="_blank" title="学习提升">学习提升</a>
                            <!-- 导航小标签 _start -->

                            <!-- 导航小标签 _end -->
                        </li>

                        <li class="fl">
                            <a class="nav " href="#" target="_blank" title="找工作">找工作</a>
                            <!-- 导航小标签 _start -->

                            <!-- 导航小标签 _end -->
                        </li>

                        <li class="fl">
                            <a class="nav " href="#" target="_blank" title="社交">社交</a>
                            <!-- 导航小标签 _start -->

                            <!-- 导航小标签 _end -->
                        </li>

                        <li class="fl">
                            <a class="nav " href="#" target="_blank" title="学历深造">学历深造</a>
                            <!-- 导航小标签 _start -->

                            <span class="nav-icon">
                            <img src="img/test/14766722355540.gif">
                        </span>

                            <!-- 导航小标签 _end -->
                        </li>


                        <li class="fr">
                            <a class="nav " href="#" target="_blank" title="帮助中心">帮助中心</a>
                            <!-- 导航小标签 _start -->

                            <!-- 导航小标签 _end -->
                        </li>

                        <li class="fr">
                            <a class="nav " href="#" target="_blank" title="学校合作">学校合作</a>
                            <!-- 导航小标签 _start -->

                            <span class="nav-icon">
                            <img src="img/test/14766722553394.gif">
                        </span>

                            <!-- 导航小标签 _end -->
                        </li>

                        <li class="fl">
                            <a class="nav " href="#" target="_blank" title="一折限量专区">抢购专区</a>
                            <!-- 导航小标签 _start -->

                            <span class="nav-icon">
                            <img src="img/test/14794053929710.gif">
                        </span>

                            <!-- 导航小标签 _end -->
                        </li>

                    </ul>
                    <div class="wrap-line" style="left: 0px; width: 72px;">
                        <span style="left: 15px;"></span>
                    </div>
                </div>


                </ul>
                <div class="wrap-line" style="left: 0px; width: 72px;">
                    <span style="left: 15px;"></span>
                </div>
            </div>

        </div>


        <div class="w1210">


                <div class="breadcrumb clearfix">
                    <a href="#" class="index">首页</a>

                    <span class="crumbs-arrow">&gt;</span>

                    <div class="crumbs-nav crumbs-nav0">
                        <a class="crumbs-title" href="#list.html?cat_id=27">
                            IT课程
                            <i class="icon"></i>
                        </a>
                        <div class="crumbs-drop">
                            <ul class="crumbs-drop-list">

                                <li>
                                    <a href="#list-36.html">艺术</a>
                                </li>

                                <li>
                                    <a href="#list-37.html">摄影</a>
                                </li>

                                <li>
                                    <a href="#list-295.html">绘画</a>
                                </li>

                                <li>
                                    <a href="#list-1050.html">舞蹈</a>
                                </li>

                            </ul>
                        </div>
                    </div>

                    <span class="crumbs-arrow">&gt;</span>

                    <div class="crumbs-nav crumbs-nav0">
                        <a class="crumbs-title" href="#list.html?cat_id=368">
                            Java编程
                            <i class="icon"></i>
                        </a>
                        <div class="crumbs-drop">
                            <ul class="crumbs-drop-list">

                                <li>
                                    <a href="#list-34.html">PHP课程</a>
                                </li>

                                <li>
                                    <a href="#list-86.html">NET网站开发</a>
                                </li>

                                <li>
                                    <a href="#list-181.html">大数据开发</a>
                                </li>

                                <li>
                                    <a href="#list-254.html">MYSQL数据库</a>
                                </li>

                            </ul>
                        </div>
                    </div>

                    <span class="crumbs-arrow">&gt;</span>

                    <div class="crumbs-nav crumbs-nav0">
                        <a class="crumbs-title" href="#list.html?cat_id=385">
                            SpringCloud入门到精通
                            <i class="icon"></i>
                        </a>
                        <div class="crumbs-drop">
                            <ul class="crumbs-drop-list">

                                <li>
                                    <a href="#list-34.html">SpringCloud</a>
                                </li>

                                <li>
                                    <a href="#list-86.html">SpringBoot</a>
                                </li>

                                <li>
                                    <a href="#list-181.html">Spring</a>
                                </li>

                                <li>
                                    <a href="#list-254.html">SpringMvc</a>
                                </li>

                            </ul>
                        </div>
                    </div>

                    <span class="crumbs-arrow">&gt;</span>
                    <span class="last" style="font-size: 16px"><b>{{course.name}}</b></span>

                </div>


                <!-- 课程详细信息 -->
                <div class="goods-info">


                    <!-- 课程图片以及相册 _star-->
                    <div id="preview" class="preview" style="width: 900px;background-color: #6c6c6c">
                        <!-- 课程相册容器 -->
                        <div class="goodsgallery" style="width: 100%">
                            <video loop width="100%" height="506px" width="900px" :poster="course.pic" id="video" controls>
                                您的浏览器不支持 video 标签。
                            </video>
                        </div>

                        <!--相册 END-->

                        <div class="goods-gallery-bottom" style="height: 110px">
                            <a href="javascript:void(0);" class="goods-col fr collect-goods" data-goods-id="429">
                                <i></i>
                                <span>收藏课程 (1000人气)</span>
                            </a>

                            <div class="bdsharebuttonbox fr bdshare-button-style0-16" data-bd-bind="XXXXXXXXX">
                                <a class="bds_more" href="#" data-cmd="more"
                                   style="background: none; color: #999; line-height: 25px; height: 25px; margin: 0px 10px; padding-left: 20px; display: block;">
                                    <i style="width: 13px; height: 13px; background: transparent url(css/goods-icon.png) no-repeat -113px -65px; vertical-align: middle; display: inline-block;"></i>
                                    分享
                                </a>
                            </div>

                            <div class="course-thumbnail" style="width: 800px;height:100px;">
                                <div style="width: 130px;height: 100px;float: left">
                                    <img :src="course.pic" alt="" height="100px" width="130px" style="border-radius: 5px;"/>
                                </div>
                                <div style="width: 500px;height:100px;float: left;color: #e7e7e7;padding-left: 10px">
                                    <p style="overflow: hidden;font-size: 15px;width: 500px;height: 30px;line-height: 30px;margin-bottom: 15px;">
                                        {{course.name}}</p>

                                    <p>
                                        <span>课程等级 : {{course.gradeName}}</span>&nbsp;&nbsp;
                                    </p>
                                    <p>
                                        <span>在学人数 : {{courseSummary.saleCount}} </span>&nbsp;&nbsp;
                                        <span>好评度 : 100%</span>&nbsp;&nbsp;
                                    </p>
                                </div>
                            </div>


                        </div>


                    </div>

                    <!-- 课程图片以及相册 _end-->
                    <!-- 课程详细信息 _star-->
                    <div class="detail-info"
                         style="float: left ;width: 300px;background-color: #2e2e2e;height: 580px;padding: 0px !important;">
                        <div style="padding: 0px 10px;">

                            <!-- 课程名称 -->
                            <h1 class="goods-name SZY-GOODS-NAME"
                                style="color: white;padding-top: 20px;border-bottom: 1px solid #b7b7b7">课程目录</h1>
                            <!-- 课程简单描述 -->
                            <p class="goods-brief second-color"></p>
                            <!-- 课程团购倒计时 -->

                            <div style="color: #eeeeee;padding-bottom: 20px;overflow-y: scroll;height: 471px;"
                                 class="goods-brief-p dir-scroll">
                             <div v-for="chapter in courseChapters">
                                    <p style="border-bottom: 1px solid rgba(165,165,165,0.32);padding-bottom: 10px;margin-bottom: 20px;font-size: 14px">
                                        {{chapter.number}} | {{chapter.name}}</p>
                                    <ul>
                                        <li v-for="media in chapter.mediaFiles" style="margin-top: 20px;width: 98%">
                                            <span style="padding: 2px;border-radius: 5px;background-color: #5e5050">录播</span>
                                            <a :media-id="chapter.id" @click="play(media.id)" class="mediaName">
                                                &nbsp; {{media.number}} - {{media.name}} (21分钟)
                                            </a>
                                            <span style="color: #40e72d" v-if="media.free">试看</span>
                                        </li>
                                    </ul>


                                </div>
                            </div>
                        </div>

                        <div style="height:80px;">
                            <!-- 加入购物车按钮、手机购买 -->
                            <div class="btn-buy"
                                 style="height: 80px;line-height: 80px;text-align: center;background-color: #525252">
                                <a @click="buyCourse" href="javascript:void(0)"
                                   style="color: #fa8919;font-size: 14px;padding: 5px;border: 1px solid #fa8919 ;border-radius: 5px">购买
                                    ¥{{courseMarket.price}} 元
                                    <font style="color: white;text-decoration: line-through;font-size: 12px">¥{{courseMarket.priceOld}}
                                        元</font> </a>
                                &nbsp;<a @click="addCart" style="color: #cb7943;font-size: 14px;">加入购物车</a>
                            </div>
                        </div>
                    </div>


                    <!-- 课程详细信息 _end-->
                    <!-- 店铺信息 _star-->

                    <!-- 店铺信息 _end-->
                </div>

                <!-- 搭配套餐 -->

                <!-- 内容 -->
                <div class="clearfix">
                <!-- 左半部分内容 -->
                <div class="fl">
                    <!-- 客服组 -->

                    <div class="aside" style="width: 210px;">
                        <span class="slide-aside"></span>
                        <div class="aside-inner" style="width: 210px; display: block;">
                            <!--新品推荐-->

                            <div class="aside-con">
                                <h2 class="aside-tit"
                                    style="border: 2px solid #f3f3f3;text-align: center;margin-bottom: -1px">新品推荐</h2>
                                <ul class="aside-list">

                                    <li>
                                        <!--售罄-->
                                        <div class="p-img">
                                            <a target="_blank" title="Gradle入门到精通" href="#"
                                               style="background: url({ imageurl($ lazyload_image)">
                                                <img height="200px" alt="" src="img/test/14788784646707(1).jpg"
                                                     data-original="http://itsource.oss-cn-beijing.aliyuncs.com/图片/shop/6/gallery/2016/11/11/14788784646707.jpg?x-oss-process=image/resize,m_pad,limit_0,h_450,w_450"
                                                     style="display: inline;">
                                            </a>
                                        </div>
                                        <div class="p-name">
                                            <a target="_blank" title="Gradle入门到精通" href="#">高级架构师</a>
                                        </div>
                                        <div class="p-price">
                                            <span class="sale-price second-color">￥2999</span>
                                            <span class="market-price">

                                            <del>￥2999</del>
                                        </span>
                                        </div>
                                    </li>

                                    <li>
                                        <!--售罄-->

                                        <div class="p-img">
                                            <a target="_blank" title="linux运维与云计算" href="#"
                                               style="background: url({ imageurl($ lazyload_image)">
                                                <img alt="" src="img/test/14789657995869(1).png"
                                                     data-original="http://itsource.oss-cn-beijing.aliyuncs.com/图片/shop/6/gallery/2016/11/12/14789657995869.png?x-oss-process=image/resize,m_pad,limit_0,h_450,w_450"
                                                     style="display: inline;">
                                            </a>
                                        </div>
                                        <div class="p-name">
                                            <a target="_blank" title="linux运维与云计算" href="#">运维及云计算</a>
                                        </div>
                                        <div class="p-price">
                                            <span class="sale-price second-color">￥3999</span>
                                            <span class="market-price">
                                            <del>￥39.90</del>
                                        </span>
                                        </div>
                                    </li>

                                    <li>
                                        <!--售罄-->

                                        <div class="p-img">
                                            <a target="_blank" title="VUE源码解析系列" href="#"
                                               style="background: url({ imageurl($ lazyload_image)">
                                                <img alt="" src="img/test/14789669544048(1).png"
                                                     data-original="http://itsource.oss-cn-beijing.aliyuncs.com/图片/shop/6/gallery/2016/11/12/14789669544048.png?x-oss-process=image/resize,m_pad,limit_0,h_450,w_450"
                                                     style="display: inline;">
                                            </a>
                                        </div>
                                        <div class="p-name">
                                            <a target="_blank" title="VUE源码解析系列" href="#">VUE源码解析系列</a>
                                        </div>
                                        <div class="p-price">
                                            <span class="sale-price second-color">￥2000</span>
                                            <span class="market-price">
                                            <del>￥50.00</del>
                                        </span>
                                        </div>
                                    </li>

                                    <li>
                                        <!--售罄-->

                                        <div class="p-img">
                                            <a target="_blank" title="大型互联网实战技术" href="#goods-10.html"
                                               style="background: url({ imageurl($ lazyload_image)">
                                                <img alt="" src="img/test/14789686200823(1).png"
                                                     data-original="http://itsource.oss-cn-beijing.aliyuncs.com/图片/shop/6/gallery/2016/11/12/14789686200823.png?x-oss-process=image/resize,m_pad,limit_0,h_450,w_450"
                                                     style="display: inline;">
                                            </a>
                                        </div>
                                        <div class="p-name">
                                            <a target="_blank" title="大型互联网实战技术" href="#goods-10.html">大型互联网实战技术</a>
                                        </div>
                                        <div class="p-price">
                                            <span class="sale-price second-color">￥1500</span>
                                            <span class="market-price">
                                            <del>￥58.80</del>
                                        </span>
                                        </div>
                                    </li>

                                </ul>
                            </div>

                            <!--销量排行榜-->
                            <div class="aside-con">
                                <h2 class="aside-tit">销量排行榜</h2>
                                <ul class="aside-list">
                                    <li>
                                        <!--售罄-->
                                        <div class="p-img">
                                            <a target="_blank" title="#" href="#goods-2393.html"
                                               style="background: url({ imageurl($ lazyload_image)">
                                                <img alt="" src="img/test/TB1RwYELXXXXXXHaXXXXXXXXXXX_!!0-item_pic.jpg"
                                                     data-original="http://itsource.img-cn-beijing.aliyuncs.com/图片/taobao-yun-images/537310635822/TB1RwYELXXXXXXHaXXXXXXXXXXX_!!0-item_pic.jpg?x-oss-process=image/resize,m_pad,limit_0,h_450,w_450"
                                                     style="display: inline;">
                                            </a>
                                        </div>
                                        <div class="p-name">
                                            <a target="_blank" title="#" href="#goods-2393.html">#</a>
                                        </div>
                                        <div class="p-price">
                                            <span class="sale-price second-color">￥79.00</span>
                                            <span class="sale-num">销量：375568</span>
                                        </div>
                                    </li>

                                    <li>
                                        <!--售罄-->

                                        <div class="p-img">
                                            <a target="_blank" title="#" href="#goods-2436.html"
                                               style="background: url({ imageurl($ lazyload_image)">
                                                <img alt="" src="img/test/TB13UeJKVXXXXcJXpXXXXXXXXXX_!!0-item_pic.jpg"
                                                     data-original="http://itsource.img-cn-beijing.aliyuncs.com/图片/taobao-yun-images/39309371619/TB13UeJKVXXXXcJXpXXXXXXXXXX_!!0-item_pic.jpg?x-oss-process=image/resize,m_pad,limit_0,h_450,w_450"
                                                     style="display: inline;">
                                            </a>
                                        </div>
                                        <div class="p-name">
                                            <a target="_blank" title="#" href="#goods-2436.html">#</a>
                                        </div>
                                        <div class="p-price">
                                            <span class="sale-price second-color">￥35.80</span>
                                            <span class="sale-num">销量：363671</span>
                                        </div>
                                    </li>

                                    <li>
                                        <!--售罄-->

                                        <div class="p-img">
                                            <a target="_blank" title="#" href="#goods-2386.html"
                                               style="background: url({ imageurl($ lazyload_image)">
                                                <img alt="" src="img/test/TB186J.NpXXXXbXXFXXXXXXXXXX_!!0-item_pic.jpg"
                                                     data-original="http://itsource.img-cn-beijing.aliyuncs.com/图片/taobao-yun-images/521136254098/TB186J.NpXXXXbXXFXXXXXXXXXX_!!0-item_pic.jpg?x-oss-process=image/resize,m_pad,limit_0,h_450,w_450"
                                                     style="display: inline;">
                                            </a>
                                        </div>
                                        <div class="p-name">
                                            <a target="_blank" title="#" href="#goods-2386.html">#</a>
                                        </div>
                                        <div class="p-price">
                                            <span class="sale-price second-color">￥49.90</span>
                                            <span class="sale-num">销量：322352</span>
                                        </div>
                                    </li>

                                    <li>
                                        <!--售罄-->

                                        <div class="p-img">
                                            <a target="_blank" title="#" href="#goods-2607.html"
                                               style="background: url({ imageurl($ lazyload_image)">
                                                <img alt="" src="img/test/TB12zSlNVXXXXb.aXXXXXXXXXXX_!!0-item_pic.jpg"
                                                     data-original="http://itsource.img-cn-beijing.aliyuncs.com/图片/taobao-yun-images/521255797655/TB12zSlNVXXXXb.aXXXXXXXXXXX_!!0-item_pic.jpg?x-oss-process=image/resize,m_pad,limit_0,h_450,w_450"
                                                     style="display: inline;">
                                            </a>
                                        </div>
                                        <div class="p-name">
                                            <a target="_blank" title="#" href="#goods-2607.html">#</a>
                                        </div>
                                        <div class="p-price">
                                            <span class="sale-price second-color">￥12.60</span>
                                            <span class="sale-num">销量：318972</span>
                                        </div>
                                    </li>

                                </ul>
                            </div>

                        </div>
                    </div>


                    <!-- 您浏览过 -->

                </div>
                <!-- 右半部分内容 -->
                <div class="right right-con">
                    <div class="wrapper">
                        <div id="main-nav-holder" class="goods-detail">
                            <ul id="nav" class="tab">

                                <li class="title-list current">
                                    <a href="javascript:;" data-tag="goods_attr_list">课程介绍</a>
                                </li>

                                <!--								<li class="title-list">-->
                                <!--									<a href="javascript:;" data-tag="goods_introduce">课程章节</a>-->
                                <!--								</li>-->
                                <li class="title-list">
                                    <a data-tag="goods_evaluate" href="javascript:;">累计评价(0)</a>
                                </li>

                            </ul>
                            <div class="right-side">
                                <!-- 失效不展示 -->

                                <a href="javascript:void(0);" class="right-addcart add-cart" id="right-addcart">
                                    <i></i> 加入学习
                                </a>

                                <div class="right-side-con" style="height: 317px;">
                                    <p style="padding: 0px;width: 100%;font-size: 12px;text-align: center;padding-top: 20px">
                                        <span>联系QQ:1456868501</span></p>
                                    <p style="padding: 0px;width: 100%;font-size: 12px;text-align: center"><span>群&nbsp;&nbsp;&nbsp;&nbsp;号: 1456868501</span>
                                    </p>
                                </div>
                            </div>
                        </div>
                        <div id="main_widget_1" style="min-height: 300px">

                            <!-- 规格参数 _star -->

                            <div id="goods_attr_list" class="goods-detail-con goods-detail-tabs"
                                 style="padding:20px;width: 797px;">
                                <h3 style="margin-bottom: 20px">讲师介绍</h3>
                                <div style="width: 797px;" class="teacher-scroll">
                                    <div v-for="teacher in teachers" style="height: 170px;">

                                        <div style="width: 120px;height: 120px;float: left;">
                                            <img :src="teacher.headImg"
                                                 style="border-radius: 50%" width="100px;height:100px"/>
                                        </div>
                                        <div style="width:660px;height: 120px;padding-left: 10px;float: right">
                                            <p style="font-size: 16px;color: #ff4341">{{teacher.name}}</p>
                                            <p style="margin-top: 10px;max-height:50px;">{{teacher.intro}}</p>
                                            <p style="margin-top: 10px;max-height:50px;">{{teacher.technology}}</p>
                                        </div>
                                    </div>
                                </div>

                                <div class="goods-detail-con"
                                     style="padding-top: 20px;width: 780px;border-top: 1px solid #e7e7e7">
                                    <h3 style="margin-bottom: 20px">课程详情</h3>
                                    <div>简介 ：
                                        {{courseDetail.description}}
                                    </div>

                                    <br><br>

                                    <div v-html="courseDetail.intro">
                                    </div>

                                    <br><br>
                                    <h3>资料下载</h3>
                                    <br><br>
                                    添加源妹儿微信：yuanmeier_520领取资料
                                    </p>
                                    <br><br> <br><br>
                                </div>
                            </div>

                            <!-- 规格参数 _end -->
                            <!-- 课程详情 _star -->
                            <div id="goods_introduce" class="goods-detail-con goods-detail-tabs"
                                 style="padding-top: 20px;padding-left: 20px;width: 797px;display:none">
                                <h3 class="zj-title" style="line-height: 30px;">第一章：SpringCloud概述</h3>
                                <p class="video-title" style="line-height: 30px;">01 | 应用架构的演变 (12分钟) &nbsp;&nbsp;&nbsp;&nbsp;
                                    <span style="color: green">试学</span></p>
                                <p class="video-title" style="line-height: 30px;">02 | SpringCloud介绍 (12分钟)</p>

                                <h3 class="zj-title" style="line-height: 30px;">第二章：Eureka实战</h3>

                                <p class="video-title" style="line-height: 30px;">01 | 应用架构的演变 (12分钟)</p>
                                <p class="video-title" style="line-height: 30px;">02 | SpringCloud介绍 (12分钟)</p>
                            </div>
                            <!-- 课程详情 end -->

                            <!-- 课程评价 start -->
                            <div id="goods_evaluate" class="goods-detail-con goods-detail-tabs"
                                 style="padding-top: 20px;padding-left: 20px;width: 797px;display:none;text-align: center">
                                <br/>
                                <br/><br/><br/><br/><br/>
                                暂无课程评价
                            </div>
                            <!-- 课程评价 end -->
                        </div>
                    </div>
                </div>
            </div>

        </div>


    <!-- 站点底部-->

    <!-- 右侧边栏 _start -->
    <div class="right-sidebar-con">
        <div class="right-sidebar-main">
            <div class="right-sidebar-panel">
                <div id="quick-links" class="quick-links">
                    <ul>
                        <li class="quick-area quick-login sidebar-user-trigger">
                            <!-- 用户 -->
                            <a href="javascript:void(0);" class="quick-links-a">
                                <i class="setting"></i>
                            </a>
                            <div class="sidebar-user quick-sidebar">
                                <i class="arrow-right"></i>
                                <div class="sidebar-user-info">
                                    <!-- 没有登录的情况 _start -->
                                    <div class="SZY-USER-NOT-LOGIN" style="">
                                        <div class="user-pic">
                                            <div class="user-pic-mask"></div>
                                            <img src="img/test/default_user_portrait_0.png">
                                        </div>
                                        <br>
                                        <p>
                                            你好！请
                                            <a href="javascript:void(0);" class="quick-login-a color ajax-login">登录</a>
                                            |
                                            <a href="http://user.ymcc.com:6003/register.html" class="color">注册</a>
                                        </p>
                                    </div>
                                    <!-- 没有登录的情况 _end -->
                                    <!-- 有登录的情况 _start -->
                                    <div class="SZY-USER-ALREADY-LOGIN" style="display: none;">
                                        <div class="user-have-login">
                                            <div class="user-pic">
                                                <div class="user-pic-mask"></div>
                                                <img src="" class="SZY-USER-PIC">
                                            </div>
                                            <div class="user-info">
                                                <p>
                                                    用&nbsp;&nbsp;&nbsp;户：
                                                    <span class="SZY-USER-NAME"></span>
                                                </p>

                                            </div>
                                        </div>
                                        <p class="m-t-10">
												<span class="prev-login">
					上次登录时间：
					<span class="SZY-USER-LAST-LOGIN"></span>
												</span>
                                            <a href="user.html" class="btn account-btn" target="_blank">个人中心</a>
                                            <a href="user/order.html" class="btn order-btn" target="_blank">订单中心</a>
                                        </p>
                                    </div>
                                    <!-- 有登录的情况 _end -->
                                </div>
                            </div>
                        </li>
                        <li class="sidebar-tabs">
                            <!-- 购物车 -->
                            <div class="cart-list quick-links-a sidebar-cartbox-trigger">
                                <i class="cart"></i>
                                <div class="span">购物车</div>
                                <span class="ECS_CARTINFO">
								<span class="cart_num SZY-CART-COUNT">0</span>
									<div class="sidebar-cart-box">
										<h3 class="sidebar-panel-header">
										<a href="javascript:void(0);" class="title">
											<i class="cart-icon"></i>
											<em class="title">购物车</em>
										</a>
										<span class="close-panel"></span>
									</h3>
									</div>
									</span>
                            </div>
                        </li>
                        <li class="sidebar-tabs">
                            <a href="javascript:void(0);"
                               class="mpbtn_history quick-links-a sidebar-historybox-trigger">
                                <i class="history"></i>
                            </a>
                            <div class="popup">
                                <font id="mpbtn_histroy">我看过的</font>
                                <i class="arrow-right"></i>
                            </div>
                        </li>
                        <!-- 如果当前页面有对比功能 则显示对比按钮 _start-->
                        <li class="sidebar-tabs">
                            <a href="javascript:void(0);"
                               class="mpbtn-contrast quick-links-a sidebar-comparebox-trigger">
                                <i class="contrast"></i>
                            </a>
                            <div class="popup">
                                对比课程
                                <i class="arrow-right"></i>
                            </div>
                        </li>
                        <!-- 如果当前页面有对比功能 则显示对比按钮 _end-->
                        <li>
                            <a href="user/collect/shop.html" target="_blank" class="mpbtn_stores quick-links-a">
                                <i class="stores"></i>
                            </a>
                            <div class="popup">
                                我收藏的店铺
                                <i class="arrow-right"></i>
                            </div>
                        </li>
                        <li id="collectGoods">
                            <a href="user/collect/goods.html" target="_blank" class="mpbtn_collect quick-links-a">
                                <i class="collect"></i>
                            </a>
                            <div class="popup">
                                我的收藏
                                <i class="arrow-right"></i>
                            </div>
                        </li>
                    </ul>
                </div>
                <div class="quick-toggle">
                    <ul>

                        <li class="quick-area">
                            <a class="quick-links-a" href="javascript:void(0);">
                                <i class="customer-service"></i>
                            </a>
                            <div class="sidebar-service quick-sidebar">
                                <i class="arrow-right"></i>

                                <div class="customer-service">
                                    <a target="_blank" href="#">
                                        <span class="icon-qq"></span> QQ
                                    </a>
                                </div>

                                <div class="customer-service">
                                    <a target="_blank" href="#">
                                        <span class="icon-ww"></span> 旺旺
                                    </a>
                                </div>

                            </div>
                        </li>

                        <li class="quick-area">
                            <a class="quick-links-a" href="javascript:void(0);">
                                <i class="qr-code"></i>
                            </a>
                            <div class="sidebar-code quick-sidebar">
                                <i class="arrow-right"></i>
                                <img src="img/test/mall_wx_qrcode_0.jpg">
                            </div>
                        </li>
                        <li class="returnTop" style="display: none;">
                            <a href="javascript:void(0);" class="return_top quick-links-a">
                                <i class="top"></i>
                            </a>
                            <div class="popup">
                                返回顶部
                                <i class="arrow-right"></i>
                            </div>
                        </li>
                    </ul>
                </div>
            </div>
            <div class="">
                <!--红包 start-->
                <!--红包 end-->
                <!--购物车 start-->

                <div class="right-sidebar-panels sidebar-cartbox">
                    <div class="sidebar-cart-box">
                        <h3 class="sidebar-panel-header">
                            <a href="javascript:void(0);" class="title" target="_blank">
                                <i class="cart-icon"></i>
                                <em class="title">购物车</em>
                            </a>
                            <span class="close-panel"></span>
                        </h3>
                        <div class="sidebar-cartbox-goods-list">

                            <div class="cart-panel-main">
                                <div class="cart-panel-content">

                                    <!-- 没有课程的展示形式 _start -->
                                    <div class="tip-box">
                                        <i class="tip-icon"></i>
                                        <div class="tip-text">
                                            您的购物车里什么都没有哦
                                            <br>
                                            <a class="color" href="" title="再去看看吧" target="_blank">再去看看吧</a>
                                        </div>
                                    </div>
                                    <!-- 没有课程的展示形式 _end-->

                                </div>
                            </div>

                        </div>
                    </div>
                </div>
                <!--购物车 end-->
                <!--浏览历史 start-->
                <!---->
                <div class="right-sidebar-panels sidebar-historybox">
                    <h3 class="sidebar-panel-header">
                        <a href="javascript:;" class="title">
                            <i></i>
                            <em class="title">我的足迹</em>
                        </a>
                        <span class="close-panel"></span>
                    </h3>
                    <div class="sidebar-panel-main">
                        <div class="sidebar-panel-content sidebar-historybox-goods-list">
                            <!---->
                            <!---->
                            <!-- 没有浏览历史的展示形式 _start -->
                            <div class="tip-box">
                                <i class="tip-icon"></i>
                                <div class="tip-text">
                                    您还没有在商城留下任何足迹哦
                                    <br>
                                    <a class="color" href="">赶快去看看吧</a>
                                </div>
                            </div>
                            <!-- 没有浏览历史的展示形式 _end-->
                            <!---->
                            <!---->
                        </div>
                    </div>
                </div>
                <!---->
                <!--浏览历史 end-->
                <!--对比列表 start-->

                <!--对比列表 start-->
                <div class="right-sidebar-panels sidebar-comparebox">
                    <h3 class="sidebar-panel-header">
                        <a href="javascript:void(0);" class="title">
                            <i class="compare-icon"></i>
                            <em class="title">宝贝对比</em>
                        </a>
                        <span class="close-panel"></span>
                    </h3>
                    <div>
                        <div class="sidebar-panel-main sidebar-comparebox-goods-list">

                            <div class="sidebar-panel-content compare-panel-content">

                                <!-- 没有对比课程的展示形式 _start -->
                                <div class="tip-box">
                                    <i class="tip-icon"></i>
                                    <div class="tip-text">
                                        您的对比宝贝什么都没有哦
                                        <br>
                                        <a class="color" href="">再去看看吧</a>
                                    </div>
                                </div>
                                <!-- 没有对比课程的展示形式 _end-->

                            </div>
                        </div>

                    </div>
                </div>
                <!--对比列表 end-->

                <!--对比列表 end-->
            </div>
        </div>
    </div>
    <!-- 右侧边栏 _end -->

    <!-- 底部 _start-->

    <div class="site-footer">

        <div class="footer-service">
        </div>


        <div class="footer-desc-copyright" style="border-top: 1px solid #eeeeee">

            <p class="footer-ecscinfo">
                <a href="#">首页</a>
                |

                <a href="#">隐私保护</a>
                |

                <a href="#">联系我们</a>
                |

                <a href="#">免责条款</a>
                |

                <a href="#">公司简介</a>
                |

                <a href="#">意见反馈</a>

                |
                <a rel="nofollow" target="_blank" href="#">会员登录</a>
                |
                <a rel="nofollow" target="_blank" href="#">会员论坛</a>
                |
                <a href="javascript:;" rel="nofollow">客服热线028-86261949</a>
            </p>
            <p class="footer-otherlink">
                <a title="源码商城" target="_blank" href="#">源码商城</a>

                |

                <a title="菁鱼课堂" target="_blank" href="#">菁鱼课堂</a>

                |

                <a title="资讯速递" target="_blank" href="#">资讯速递</a>

                |

                <a title="快递查询" target="_blank" href="http://m.kuaidi100.com">快递查询</a>

                |

                <a title="论坛" target="_blank" href="#">会员论坛</a>

                |

                <a title="源代码教育咨询有限公司" target="_blank" href="#">源代码教育咨询有限公司</a>

            </p>

            <p class="footer-beian"> ICP备案证书号:
                <a rel="nofollow" target="_blank" href="#">蜀ICP备88888888号-1</a>
                <a rel="nofollow" target="_blank" href="#"><i></i>蜀公网安备 45323525326664号</a>
            </p>
            <p class="footer-Copyright">Copyright &copy; 2017
            <p>&nbsp;</p>

            <p class="footer-fp-img">
                <a target="_blank" href="#"><img src="img/test/kxwz.png"></a>
                <a target="_blank" href="#"><img src="img/test/smyz.png"></a>
                <a target="_blank" href="#"><img src="img/test/cxyz.jpg"></a>
                <a target="_blank" href="#"><img src="img/test/hyyz.png"></a>
                <a target="_blank" href="#"><img src="img/test/jpfw.png"></a>
            </p>
        </div>

    </div>

    <!-- 第三方流量统计 -->
    <div style="display: none;"></div>
    <!-- 底部 _end-->

</div>
</body>
<script type="text/javascript">
    window._bd_share_config = {
        "common": {
            "bdSnsKey": {},
            "bdText": "感觉不错，分享一下~",
            "bdMini": "2",
            "bdMiniList": false,
            "bdPic": "http://68products.oss-cn-beijing.aliyuncs.com/taobao-yun-images/41458920633/TB2K2cAaICO.eBjSZFzXXaRiVXa_!!1739732836.jpg?x-oss-process=image/resize,m_pad,limit_0,h_320,w_320",
            "bdStyle": "0",
            "bdSize": "16"
        },
        "share": {}
    };
    with (document) {
        0[(getElementsByTagName('head')[0] || body).appendChild(createElement('script')).src = '//bdimg.share.baidu.com/static/api/js/share.js?v=89860593.js?cdnversion=' + ~(-new Date() / 36e5)];
    }
</script>
<!-- 头部右侧鼠标经过图片放大效果 _start -->
<script type="text/javascript" src="js/bubbleup.js"></script>
<!-- 头部右侧鼠标经过图片放大效果 _end -->
<!-- 套餐、店内排行等左右切换效果 _start-->
<script type="text/javascript" src="js/tabs.js"></script>
<!-- 套餐、店内排行等左右切换效果 _end -->
<!-- 右侧课程信息等定位切换效果 _start -->
<script type="text/javascript" src="js/tabs_totop.js"></script>
<!-- 右侧课程信息等定位切换效果 _end -->
<!-- 放大镜 _start -->
<script type="text/javascript" src="js/magiczoom.js"></script>
<!-- 放大镜 _end -->
<!-- 控制图片经过放大 -->
<script type="text/javascript" src="js/goods.js"></script>
<!-- 地址选择 _start -->·1
<script type="text/javascript" src="js/select_region.js"></script>
<!-- 获取当前地址 -->
<script type="text/javascript">
    //固定滚动条位置
    $.fixedScorll.read("SZY_GOODS_SCORLL");

    $().ready(function () {

        var desc_container = $(".goods-detail-content");
        var titleList = $(".title-list a");

        titleList.click(function (event) {
            var tag = $(event.target).data("tag");
            $(".goods-detail-tabs").css("display", "none");
            $("#" + tag).css("display", "block");
        });

        function load() {
            // 加载课程详情

        }

        load();

        // 加载课程详情和评论
        $(window).scroll(function () {
            load();
        });

    });
</script>
<!-- 结束：主要区域内容-->
<script type="text/javascript" src="js/jquery.fly.min.js"></script>
<script type="text/javascript" src="js/szy.cart.js"></script>
<!--[if lte IE 9]>
<script type="text/javascript" src="/js/requestAnimationFrame.js"></script>
<script type="text/javascript" src="js/common.js"></script>

<![endif]-->
<script type="text/javascript">
    new Vue({
        el: "#myBody",
        data() {
            return {
                courseMarket: {},
                course: {},
                courseChapters: [],
                teachers: [],
                courseSummary: {},
                courseDetail: {},
                courseId: ""
            }
        },
        methods: {
            buyCourse() {
                var _this = this;
                // 获取防重Token
                this.$http.get("common/createToken").then(res => {
                    if (res.data.success) {
                        window.open("/order.confirm.html?courseId=" + this.courseId + "&token=" + res.data.data);
                        // window.open("/order.confirm.html?courseId=" + this.courseId + "&token=66666");
                    } else {
                        $.alert("服务器异常[防重Token获取失败]");
                    }
                }).catch(error => {
                    $.alert("服务器异常[防重Token获取失败]");
                });
            },
            addCart() {
                if (this.courseId) {
                    this.$http.post("cart/courseCart/add/" + this.courseId).then(res => {
                        if (res.data.success) {
                            $.alert("添加成功，请在购物车查看");
                        } else {
                            $.alert(res.data.message);
                        }
                    }).catch(error => {
                        $.alert("购物车添加失败,建议直接购买");
                    })
                }
            },
            videoInit(src) {
                var video = document.getElementById('video');
                if (Hls.isSupported()) {
                    var hls = new Hls({
                        debug: true,
                    });
                    hls.loadSource(src);
                    //hls.loadSource('http://115.159.88.63:8080/live/23b52cc0e985544b0f240d5d2d8fed10.m3u8');
                    hls.attachMedia(video);
                    hls.on(Hls.Events.MEDIA_ATTACHED, function () {
                        video.muted = true;
                        video.play();
                    });
                } else if (video.canPlayType('application/vnd.apple.mpegurl')) {
                    video.src = 'https://test-streams.mux.dev/x36xhzz/x36xhzz.m3u8';
                    video.addEventListener('canplay', function () {
                        video.play();
                    });
                }
            },
            getCourse() {
                if (this.courseId) {
                    //发送请求到后台获取数据
                    this.$http.get("course/course/detailData/" + this.courseId).then(res => {
                        if (res.data.success) {
                            this.course = res.data.data.course;
                            this.courseMarket = res.data.data.courseMarket;
                            this.courseChapters = res.data.data.courseChapters;
                            this.teachers = res.data.data.teachers;
                            this.courseDetail = res.data.data.courseDetail;
                            this.courseSummary = res.data.data.courseSummary;
                            console.log(this.courseChapters)
                        } else {
                            $.alert(res.data.message);
                        }
                    }).catch(error => {
                        $.alert("课程数据获取失败");
                    })
                }
            },

            play(mediaId) {
                if (mediaId) {
                    this.$http.get("/media/mediaFile/getForUser/" + mediaId).then(res => {
                        if (res.data.success) {
                            this.videoInit(res.data.data);
                        } else {
                            if(res.data.code == 402){
                                alert(res.data.message);
                                var courseId = api.getQueryVariable("courseId")
                                window.location.href="http://user.ymcc.com:6003/login.html?callUrl=http://www.ymcc.com:6002/detail.html?courseId="+courseId;
                            }
                            if(res.data.code == 600){
                                alert(res.data.message);
                            }
                        }

                    })
                }
            },

        },
        mounted() {
            var courseId = api.getQueryVariable("courseId");
            this.courseId = courseId;
            this.getCourse();
        }
    });
</script>

<style>
    video {
        object-fit: fill;
    }

    .mediaName:hover {
        color: #2e8ded;
    }

    .mediaName {
        cursor: pointer;
        color: #d8d8d8;
    }

    .goods-brief-p p {
        margin-top: 20px !important;
        color: white;
    }

    .goods-brief-p p a {
        color: white;
        font-size: 14px;
    }

    .goods-brief-p p a:hover {
        color: red;
    }

    .dir-scroll {
        -ms-overflow-style: none;
        overflow: -moz-scrollbars-none;
    }

    .dir-scroll::-webkit-scrollbar {
        width: 0px
    }

    .wrapper .goods-detail {
        width: 978px;
    }

    .goods-detail-tabs {
        min-height: 600px;
        border: 1px solid #e5e5e5;
    }

    .wrapper #goods_attr_list {
        border-bottom: 1px solid #e5e5e5;
    }

    .video-title {
        border-bottom: 1px solid #e7e7e7;
        line-height: 50px !important;
    }

    .zj-title {
        margin-top: 20px !important;
    }

    .video-title:hover {
        background-color: #e7e7e7;
        width: 8000px;
        cursor: pointer;
    }

    .p-img {
        height: 160px !important;
    }

    .p-img img {
        height: 160px !important;
        width: 198px !important;
    }
</style>

</html>